<style>
    #tableTbImg + .layui-table-view .layui-table-body tbody > tr > td {
        padding: 0;
    }

    #tableTbImg + .layui-table-view .layui-table-body tbody > tr > td > .layui-table-cell {
        height: 60px;
        line-height: 60px;
    }

    .tdImg {
        width: 50px;
        height: 50px;
        max-width: none;
        cursor: pointer;
    }

    .layui-table-view {
        margin: 0;
    }
</style>

<!-- 正文开始 -->
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body" id="layPhotosTbImg">
            <table id="tableTbImg" lay-filter="tableTbImg"></table>
        </div>
    </div>
</div>

<!-- js部分 -->
<script>
    layui.use(['layer', 'table', 'util'], function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var table = layui.table;
        var util = layui.util;
        var config = layui.config;

        // 渲染表格
        table.render({
            elem: '#tableTbImg',
            url: config.base_server + 'user.json',
            page: true,
            cellMinWidth: 100,
            cols: [[
                {type: 'numbers'},
                {
                    align: 'center', templet: function (d) {
                        // var url = d.imgUrl;
                        var url = 'https://pic.qqtn.com/up/2018-9/15367146917869444.jpg';
                        return '<img src="' + url + '" class="tdImg" />';
                    }, title: '头像', width: 90, unresize: true
                },
                {field: 'username', align: 'center', sort: true, title: '账号'},
                {field: 'nickName', align: 'center', sort: true, title: '用户名'},
                {field: 'phone', align: 'center', sort: true, title: '手机号'},
                {field: 'sex', align: 'center', sort: true, title: '性别'},
                {
                    sort: true, align: 'center', templet: function (d) {
                        return util.toDateString(d.createTime);
                    }, title: '创建时间'
                }
            ]],
            done: function () {
                layer.photos({
                    photos: '#layPhotosTbImg',
                    shade: .1,
                    closeBtn: true
                });
            }
        });

    });
</script>